<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<link rel="stylesheet" type="text/css" media="screen" href="css/smoothness/jquery-ui-1.9.0.custom.css" />	<!-- jqueryUI CSS -->
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />							<!-- jqGrid CSS -->
<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>										<!-- jQuery 核心 -->
<script src="js/grid.locale-tw.js" type="text/javascript"></script>											<!-- jqGrid 語系檔 -->
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>										<!-- jqGrid 核心 -->
<script src="js/jquery-ui-1.9.0.custom.min.js" type="text/javascript"></script>							<!-- jqueryUI 核心 -->


<title>維護人員</title>

<script type="text/javascript">
$(document).ready(function() {
	
});
</script>

</head>
<body>

<table id="grid1"></table>
<div id="pager"></div>
<script type="text/javascript">

$("#grid1").jqGrid({
	url:'QueryPersonnel',
	datatype: "json",
	type: "post",
   	colNames:['人員ID','人員名稱','電子郵件'],
   	colModel:[
   		{name:'userid',index:'userid',key:true,editable:true,editrules:{required:true}},
   		{name:'username',index:'username',editable:true,editrules:{required:true}},
   		{name:'email',index:'email',editable:true,editrules:{required:true,email:true}}
   	],
   	width:460,
   	rowNum:5,
   	loadonce:true,
   	rowList:[10,20,30],
   	pager: '#pager',
   	rownumbers: true,
   	viewrecords: true,	
	editurl: "ManipulateGridPersonnel",
    caption:"設定人員"
});

function checkDuplicated() {
	var userId = $("#userid")[0].value;
	var ll = $("#grid1").jqGrid('getDataIDs');
	var isDuplicated = false;
	for(var i=0;i<ll.length;i++){
		if (ll[i] == userId ) {
			isDuplicated = true;
		}
	}
	
	if (isDuplicated) {
		alert(userId+"已經存在，人員ID不可重覆 !");
	} else {
		var userName = $("#username")[0].value;
		var email = $("#email")[0].value;
		var dataAdd = {"userid":userId,"username":userName,"email":email};
		var _iCount = $("#grid1").jqGrid('getGridParam', 'records');
		$("#grid1").jqGrid('addRowData', _iCount+1,dataAdd);
	} 
	return [];
}

jQuery("#grid1").navGrid('#pager',{edit:true,add:true,del:true}
	,{	// edit
		onclickSubmit:function() {
			var sysId = $("#userid")[0].value;
			var sysName = $("#username")[0].value;
			var dataAdd = {"userid":sysId,"username":sysName};
			$("#grid1").jqGrid('setRowData', sysId,dataAdd);
		}
	}
	,{	// add
		onclickSubmit:function() {
			checkDuplicated();
		}
	}
);


</script>



</body>
</html>